<template>
<div class="store">
  <Top title="收藏列表" />
  <van-empty description="暂无收藏" v-if="storeList.length===0"></van-empty>
  <div class="list">
    <van-swipe-cell :key="item.news.id" v-for="item in storeList">
      <Item :data="{...item.news,images:[item.news.image],hint:''}" :active='false' />
      <template #right>
        <van-button square type="danger" text="删除" @click="removeHandle(item.id)" />
      </template>
    </van-swipe-cell>
  </div>
</div>
</template>
<script setup>
import { computed, onBeforeMount } from "vue-demi";
import api from "../api";
import Item from "../components/Item.vue";
import { Toast } from "vant";
import "vant/es/toast/style";
import Top from "../components/Top.vue";
import { useStore } from "../store";
const store = useStore()
let storeList = computed(()=>{
  return store.storeList||[]
})
onBeforeMount(()=>{
  if(store.storeList===null||store.storeList===undefined) store.changeStoreListAsync()
})
const removeHandle = async (id)=>{
  let {code} = await api.storeRemove(id)
  if(+code!==0){
    Toast('删除失败')
    return
  }
  Toast("删除成功")
  store.removeStoreList(id)
}
</script>

<style lang="less" scoped>
.list {
  padding: 0 20px;
  /deep/.van-button {
    margin-left: 4px;
    margin-top: 25px;
  }
}
.store {
  min-height: 100vh;
}
</style>
